
import React from 'react';
import { inject , observer } from 'mobx-react';
import { WeaTools , WeaDialog , WeaRightMenu , WeaPopoverHrm , WeaMoreButton,WeaSearchGroup,WeaFormItem, WeaLocaleProvider} from 'ecCom';
import {WeaSwitch} from 'comsMobx';
import { Button } from 'antd';
const getLabel = WeaLocaleProvider.getLabel;

@observer
export default class Main extends React.Component{
    constructor(props) {
        super(props);
    }

    render(){
        const {wfForwardStore = {}} =  this.props;
        const {addGroupModalVisible = false,controllAddModal} = wfForwardStore;
        return(
            <div>
                <WeaDialog
                    title = {getLabel('81554',"常用组")}
                    hasScroll={true}
                    visible = {addGroupModalVisible}
                    icon = {'icon-coms-workflow'}
                    iconBgcolor="#0079DE"
                    closable={true}
                    onCancel={()=>{controllAddModal(false)}}
                    buttons={this.getAddModalButtons()}
                    style={{height:"300px" , width:"500px"}}
                    className={'wea-dialog-add-group-modal'}
                >
                    <WeaPopoverHrm  inDialog={true} />
                    <WeaRightMenu datas={this.getRightMenu()}>
                        {this.initGroup()}
                    </WeaRightMenu>
                </WeaDialog>
            </div>
        )
    }

    initGroup(){
        const {wfForwardStore = {}} = this.props;
        const {addGroupForm,addFormConditions} = wfForwardStore;
        const {isFormInit} = addGroupForm;
        const group  = [];
        const formParams = addGroupForm.getFormParams();
        isFormInit && addFormConditions.map(c =>{
            let items = [];
            c.items.map(field => {
                items.push({
                    com:(<WeaFormItem
                        label={`${field.label}`}
                        labelCol={{span: 6}}
                        error={addGroupForm.getError(field)}
                        tipPosition="bottom"
                        wrapperCol={{span: 17}}>
                        <WeaSwitch fieldConfig={field} form={addGroupForm} formParams={formParams}/>
                    </WeaFormItem>),
                    colSpan:2
                })
            });
            group.push(<WeaSearchGroup col={1} needTigger={true} title={c.title} showGroup={c.defaultshow} items={items}/>)
        });
        return group;
    }

    getRightMenu(){
        let btns = [];
        btns.push({
            key: "add",
            icon: <i className='icon-coms-Preservation'/>,
            content: getLabel(86,'保存'),
            onClick: () => {this.doSave()}
        });
        return btns;
    }

    doSave(){
        const {wfForwardStore = {}} = this.props;
        const {addGroupForm,saveGroup} = wfForwardStore;
        addGroupForm.validateForm().then(f=>{
            if(f.isValid){
                saveGroup();
            }else{
                f.showErrors();
                this.setState({date: new Date()}); // 改变一个state的变量,强制页面刷新
            }
        });
    }


    getAddModalButtons() {
        return [
            (<Button type="primary" onClick={()=>{this.doSave()}}>{getLabel(86,'保存')}</Button>)
        ];
    }
}